<template>
  <div class="edit-layout data-edit-skill">
    <back-button @click="backAction" />
    <div class="edit-layout-button-row">
      <cg-button @click="submitAction">提交</cg-button>
    </div>
    <div class="edit-layout-content-row">
      <cg-scrollbar wrap-height="max">
        <cg-form
          :fields="fields"
          :values="formData"
          @value-change="(key: string, value: any) => setFormValue(key, value)"
        />
      </cg-scrollbar>
    </div>
  </div>
</template>

<script setup lang="ts">
import { ref, onMounted } from 'vue'
import backButton from '../../../common/components/back-button.vue'
import layout from '../components/edit-layout'
import { findScripts } from '../global'

defineOptions({
  name: 'data-edit-mission'
})

const scripts = ref([])

const context = {
  data: {
    scripts
  },
  components: {}
}

const { formData, fields, setFormValue, backAction, submitAction, init } = layout(
  'mission',
  context
)

onMounted(() => {
  init()
  findScripts(scripts, 1)
})
</script>

<style lang="scss"></style>
